<template>
 	<Layout class="p-5 bg-white">
		<!-- {{voucherType.statu}} -->
 		<Form class="p-5" :label-width="150">
 		<Row>
		<Col span="8">
			<FormItem class="w-100" label="会员券名称">
				<Input v-model="voucherType.name" placeholder="请输入会员券名称" :onkeyup="voucherType.name = voucherType.name.replace(/\s+/g,'')"></Input>
			</FormItem>
			<FormItem class="w-100" label="有效时长/天">
				<!-- <InputNumber v-model="voucherType.timeLongs" clearable  style="width: 170px;" :parser="value => value.replace('.', '')" ></InputNumber> -->
				<!-- <Input v-model="voucherType.timeLongs" placeholder="请输入有效时长" style="width: 170px;"/> -->
				<!-- <InputNumber v-model="voucherType.timeLongs" placeholder="请输入有效时长" style="width: 170px;"/> -->
				<Input @keyup.native="changeNumber" v-model="voucherType.timeLongs" placeholder="请输入时长"></Input>
				<!-- <Input v-model="voucherType.timeLongs" placeholder="请输入时长" :onkeyup="voucherType.timeLongs = voucherType.timeLongs.replace(/\s+/g,'')"></Input> -->
			</FormItem>
			<FormItem class="w-100"  label="会员券状态">
				<Select  v-model="voucherType.statu" placeholder="请选择会员券状态"  @change="" clearable>
					<Option v-for="item in status" :value="item.value" :key="item.value">{{ item.label }}</Option>
				</Select>
			</FormItem>
			<FormItem class="text-right" > 
				<Button @click="submit" type="primary">提交</Button>
				<Button @click="cancel" class="ml-2">取消</Button>
			</FormItem>
		</Col>
		</Row>
 		</Form>
 	</Layout>
 </template>
 
 <script>
 	export default {
 		data() {
 			return {
  					voucherType:{
						name:'',
						timeLongs:'',
						statu:'',
					},
  					status:[{
  						value: "1",
  						label:"可用"
  					},
  					{
  						value: "0",
  						label:"禁用"
  					}],
					
  			};
 		},
 		
 		methods: {
			changeNumber() {
				let str = '' + this.voucherType.timeLongs;      
				if (str.indexOf('.') != -1) {        
					let arr = str.split('');
			        arr.splice(arr.length - 1);        
					let str2 = arr.join('');        
					this.voucherType.timeLongs = +str2;
			      }
			    },
			init: function() {
				this.search();
			},
			search: function() {
				this.http.get({
					url: "/client/voucher-type/page",
					param: {
						statu: this.$data.records.statu
					}
				}).then(data => {
					this.$data.tableInfo.data = data.records;
				});
			},
 			submit: function() {
				if(this.voucherType.name != null && this.voucherType.name != ""){
					if(this.voucherType.timeLongs != null && this.voucherType.timeLongs != "" && this.voucherType.timeLongs > 0){
						let self = this;
						this.http.post({
							url: "/client/voucher-type/info",
							param: this.$data.voucherType
						}).then(data => {
							self.message.info("新增成功");
							this.$tabs.close();
							this.$tabs.open("/voucherType");
							// this.$router.go(-1);
						// 	this.$tabs.close();
						});
					}else{
						this.message.error("时长无效");
					}
				}else{
					this.message.error("会员券类型名称不可为空");
				}
 				
 			},
 			cancel: function() {
				this.$router.go(-1);
 				this.$tabs.close();
 			},
			created: function() {
				this.init();
			},
 		}
 	}
 </script>
 
 <style>
 </style>